<?php 

$uploader = array(
		'name'	=>	'userfile',
		'id'	=>	'userfile',
		'size'	=>	'20',
		'style'	=>	'margin-bottom: 20px;'
		);


$upload = array(
		'value'	=>	'Upload',
		'id'=>	'submit',
		'name'=>	'submit'
		);


$options = array();
foreach($property_id as $row){
	$options[$row->project_id] = $row->project_id;
}


$lat = array(
		'name'	=>	'lat',
		'id'	=>	'lat',
		'value'	=>	set_value('lat'),
		'placeholder'	=>	'Latitude',
		'autofocus'	=>	'');

$lon = array(
		'name'	=>	'lon',
		'id'	=>	'lon',
		'value'	=>	set_value('lon'),
		'placeholder'	=>	'Longitude');

$submit = array(
		'value'	=>	'Submit',
		'id'=>	'submit',
		'name'=>	'submit'
);

$addImgBtn = array(
		'value'	=>	'Get from an image',
		'id'=>	'addImgBtn',
		'name'=>	'addImgBtn'
);

?>

<!DOCTYPE html> 
<html lang="en">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Property Information v1.0 - BLUE MOUNTAIN PROPERTIES</title>

<link href="<?php echo base_url(); ?>assets/css/styles_addgeo.css" rel="stylesheet" type="text/css">
<link rel="stylesheet" href="<?php echo base_url(); ?>assets/css/reveal.css">
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.js"></script>
<script type="text/javascript" src="<?php echo base_url(); ?>assets/javascript/jquery.reveal.js"></script>
<script type="text/javascript" src="<?php echo base_url(); ?>assets/javascript/map.preview.js"></script>
<script type="text/javascript" src="<?php echo base_url(); ?>assets/javascript/jscolor/jscolor.js"></script>
<script type="text/javascript">
var baseurl = '<?php echo base_url(); ?>';
</script>
<script type="text/javascript" src="<?php echo base_url(); ?>assets/javascript/ajaxfileupload.js"></script>
<script type="text/javascript" src="<?php echo base_url(); ?>assets/javascript/addgeodata.fileupload.js"></script>
<script type="text/javascript" src="<?php echo base_url(); ?>assets/javascript/ajax.geodatasubmit.js"></script>

<script type="text/javascript">
$(document).ready(function() {
	$('#waiter').hide();
	});
</script>
<script type="text/javascript">
$(document).ready(function() {
	$('#waiter').hide();
	//$('#uploadError').hide();
	});
</script>
<script type="text/javascript">
function changeMarker(){
	$('#color').change(function() {
		var color = $(this).val();
		//alert(color);
		if(color == 'FFFFFF'){
			color = null;
		}
		var lat = $('#lat').val();
		var lon = $('#lon').val();
		
		//checking the drag enabler checkbox
		if ($('#toggle').is(':checked')){
	  		var draggable = true;
	  	}
		
		else{
			var draggable = false;
		}
		
		//check if values are empty
		if(lat != '' && lon != ''){
			initialize(lat, lon, draggable, color);
		}
		
		else if(lat == '' && lon == ''){
			initialize(null,null,null,color);
		}
		
		});	
}
</script>
</head>

<body onload="initialize()">
<div id="wrapper">
		<div id="geoform">
		<?php echo form_open($action="");?>
		<p style="font-size: 12px;">Please select the relevent property id to add geo location data</p>
		<div style="clear: both; margin-bottom: 10px;">
		<?php echo form_dropdown('propertyid',$options,'',"id ='propertyid'"); ?>
		<input id="color" name="color" class="color" onchange="changeMarker()" onclick="changeMarker()">
		</div>
		<div id="inputs">
		<?php echo form_input($lat);?>
		<?php echo form_input($lon);?>
		</div>
		<div id="actions">
		<div style="float:left"><a data-reveal-id="mygeo_Modal"><?php echo form_submit($submit);?></a>
		</div>
		<div style="float:left;font-size: 10px; margin-left: 10px; margin-top: 10px;">
		<a href="#" data-reveal-id="myModal">need to extract from an image?</a>
		</div>
</div>
<?php echo form_close();?>
	</div>
	<div id="map_canvas">
		
	</div>
</div>
<div id="myModal" class="reveal-modal">
     <div id="uploadForm">
     <p style="font-size: 12px;">Please select an image to upload and extract geo location data.<br /> (*supported formats - JPEG | TIFF)</p>
		<?php echo form_open_multipart('',array('id'=>'do_upload'));?>	
			<?php echo form_upload($uploader); ?>
			<div id="actions">
			<div style="float:left"><?php echo form_submit($upload);?>
			</div>
			<div id="circle" style="float: left; margin-top: 10px; margin-left: 20px;">
			<img id="waiter" src="<?php echo base_url().'assets/imgs/chasingarrows.gif' ?>" />
			</div>
		<?php echo form_close();?>
	</div>
	</div>
     <a id="close-reveal-modal" class="close-reveal-modal">&#215;</a>
</div>

<div id="mygeo_Modal" class="reveal-modal">
		
     <div id="debug"></div>
     <a class="close-reveal-modal" id="close-reveal-modal">&#215;</a>
</div>

</body>
</html>
